import { CollapseComponent } from './collapse.component';
import { Component, OnInit, TemplateRef, Input } from '@angular/core';
import { dropAnimation } from '../shared/animation/index';


@Component({
  selector: 'el-collapse-item',
  templateUrl: './collapse-item.component.html',
  animations: [dropAnimation],
})
export class CollapseItemComponent implements OnInit {
  private root: any;
  @Input() labelTmp!: TemplateRef<any>;
  @Input('title') label: string = '';
  @Input('name') value: number | string | null = null;
  @Input() isActive: boolean = false;
  @Input() focusing:boolean = false;
  @Input() disabled:boolean = false;
  constructor(root: CollapseComponent) {
    this.root = root;
  };

  ngOnInit(): void {
    var _this = this;
    var /** @type {?} */ updateHandle = function () { return _this.updateActiveStatus(); };
    this.root.subscriber.push(updateHandle);
  }

  updateActiveStatus(): void {
    var _this = this;
    this.isActive = this.root.modelValue.some(function (val: any) { return val === _this.value; });
  };


  clickHandle(): void {
    if (this.value === null) {
      this.value = Math.random().toString(16).substr(2, 8);
    }
    this.focusing = true;
    this.root.updateModel(this.value);
  };

}
